import { 
    of,concat, 
    // interval,
    // merge,
    // interval,
    // map,
    // zip,
    // combineLatest,
    // forkJoin,
    // race
    // partition,
    // startWith,
    // pairwise
} from 'rxjs'
import { 
    // map, 
    // take,    
} from 'rxjs/operators'

const CombinationOperator = () => {
    /* concat： 将多个Observable 组合成一个新的Observable,且每个Observable 结束后才继续下一个Observable */ 
    const sourceA = of(1,2)
    const sourceB = of(3,4)
    const sourceC = of(5,6)
    concat(sourceA,sourceB,sourceC).subscribe(data => console.log(`concat 示例：${data}`))
    // 结果： 1 2 3 4 5 6

    /* merge: 同时启动参数内的所有Observable,平行处理 */
    // const sA = interval(1000).pipe(map(data => `A${++data}`))
    // const sB = interval(3000).pipe(map(data => `B${++data}`))
    // const sC = interval(5000).pipe(map(data => `C${++data}`))
    // merge(sA,sB,sC).subscribe(data => console.log(`merge示例: ${data}`))

    // const sA = interval(1000).pipe(map(data => `A${++data}`))
    // const sB = interval(2000).pipe(map(data => `B${++data}`))
    // const sC = interval(3000).pipe(map(data => `C${++data}`))

    /* zip: 将传入的Observable 依次组合在一起成为一组 */
    // zip(sA,sB,sC).subscribe(data => console.log(`zip: ${data}`))

    /* combineLatest: 在数据流有事件发生时，跟其他数据流的最后一个事件组合在一起 */
    // combineLatest([sA,sB,sC]).subscribe(data => console.log(`combineLatest: ${data}`))

    // const sA = interval(1000).pipe(map(data => `A${++data}`),take(5))
    // const sB = interval(2000).pipe(map(data => `B${++data}`),take(4))
    // const sC = interval(3000).pipe(map(data => `C${++data}`),take(3))

    /* forkJoin 同时订阅多个Observable, 每个Observable 结束后，将每个Observable的最后一个值组合起来 */
    // forkJoin([sA,sB,sC]).subscribe({
    //     next: data => console.log(`forkJoin: ${data}`),
    //     complete: () => console.log('forkJoin 结束')
    // })
     
    // const sA = interval(1000).pipe(map(data => `A${++data}`))
    // const sB = interval(2000).pipe(map(data => `B${++data}`))
    // const sC = interval(3000).pipe(map(data => `C${++data}`))
    /* race: 同时订阅多个Observable, 以最快发生事件Observable 为主，并退订其他的Observable*/
    // race([sA,sB,sC]).subscribe(data => console.log(`race：${data}`))

    /* partition: 将Observable 按照规则拆成两个Observable*/
    // const source = of(1,2,3,4,5,6)
    // const [sourceEven,sourceOdd] = partition(source,data => data %2 === 0)
    // sourceEven.subscribe(data => console.log(`partition 偶数：${data}`))
    // sourceOdd.subscribe(data => console.log(`partition 奇数：${data}`))

    /* startWith */
    // interval(1000).pipe(take(6),map(data => data + 1),startWith(0),pairwise())

    return (
        <section style={{padding: '20px'}}>
            <h1>组合操作符：</h1>
            <p>concat</p>
            <p>merge</p>
            <p>zip</p>
            <p>combineLatest</p>
            <p>forkJoin</p>
            <p>race</p>
            <p>partition</p>
            <p>switchAll</p>
            <p>concatAll</p>
            <p>mergeAll</p>
            <p>combineAll</p>
            <p>startWith</p>
        </section>
    )
}

export default CombinationOperator